<template>
	<view class="seckill">
		<!--
			state_type:0(正在秒杀)
			state_type:1(等待下一场秒杀)
			state_type:2(秒杀活动结束)
			
		-->
		<image class="product_banner" :src="Url+'mine/index/seckill_banner.png'" mode=""></image>
		<view class="seckill_time" v-if="state_type == 0 && skillflag">
			<text>距离秒杀结束</text>
			<uni-countdown :show-day="false" :hour="dateInfo.h" :minute="dateInfo.m" :second="dateInfo.s"></uni-countdown>
		</view>
		<view class="seckill_time" v-else-if="state_type == 2  && skillflag">
			本场秒杀已结束
		</view>
		<view class="seckill_time" v-else-if="state_type == 1  && skillflag">
			<text class="next_seckill">距离下一场秒杀</text>
			<uni-countdown :show-day="false" :hour="dateInfo.h" :minute="dateInfo.m" :second="dateInfo.s" endSe="#7246DD"></uni-countdown>
		</view>
		<sec-kill @toproductdetail="toproductdetail" :product="product" :state_type="state_type"  v-if="skillflag"></sec-kill>
		<uni-load-more :loadingType="loadingType" :contentText="contentText" v-if="skillflag"></uni-load-more>
		<shop-loading v-if="shopLoad"></shop-loading>
		<sc-no v-if="!skillflag" :noStatus="true" @navtive="navtive" url="add_images/no_data.png" nofont="暂无秒杀商品" width="25%" ></sc-no>
		<sc-home></sc-home>
	</view>
</template>

<script>
	import secKill from '@/components/seckill/seckill.vue'
	import uniCountdown from '@/components/uni-countdown/uni-countdown.vue';
	import uniLoadMore from '@/components/uni-load-more.vue';
	import scNo from '@/components/sc-no/sc-no.vue';
	import {
		skill,
		seckillGoods
	} from '@/common/skill.js';
	import list from '@/mixins/list.js'
	export default {
		components: {
			secKill,
			uniCountdown,
			uniLoadMore,
			scNo
		},
		data() {
			return {
				Url: this.Imgurl,
				state_type: 0, //0(本场进行中),1(下场未开始),2(本场已结束)
				hour: 12,
				product: [],
				cover: '',
				skillId: 0,
				skill_time: [],
				dateInfo: {
					h: 0,
					m: 0,
					s: 0,
				},
				shopLoad: true,
				skillflag:false

			}
		},
		mixins: [list],
		methods: {
			navtive(){
				  uni.reLaunch({
				  	url:'/pages/index/index'
				  })
			},
			toproductdetail(key) {
				uni.navigateTo({
					url: '/pageB/classify/productdetail?type=0&id=' + key
				})
			},
			getData() {
				this.shopLoad = true;
				skill().then(res => {
					console.log(res)
					if (res.code == 1) {
						var goods = res.msg.goods
						if (goods.data.length) {
							this.product = goods.data
							this.page = goods.current_page
							this.last_page = goods.last_page
							this.cover = res.msg.cover
							this.state_type = res.msg.skill_state
							this.skillId = res.msg.id
							let time = res.msg.skill_time;
							if (time) {
								this.getDuration(time)
							}
							uni.hideLoading();
							uni.stopPullDownRefresh();
							this.loadingType = goods.last_page > 1 ? 0 : 2;
							this.skillflag = true
						}
						this.shopLoad = false;
					} else {
						this.shopLoad = false;
						uni.hideNavigationBarLoading();
						uni.stopPullDownRefresh();
					}
				}).catch()
			},
			getDuration(my_time) {
				var hours = Math.floor(my_time / 3600)
				var minutes = Math.floor((my_time - hours * 3600) / 60)
				var seconds = my_time - hours * 3600 - minutes * 60
				this.dateInfo = {
					h: hours,
					m: minutes,
					s: seconds
				}
				console.log(this.dateInfo)
			},
			getmoreNews() {
				if (this.loadingType !== 0) { //loadingType!=0;直接返回
					return false;
				}
				this.loadingType = 1;
				uni.showLoading({
					title: '加载中'
				});
				if (this.page == this.last_page) {
					uni.hideLoading();
					uni.stopPullDownRefresh(); //得到数据后停止下拉刷新
				} else {
					this.page++;
					let params = {
						page: this.page,
						id: this.skillId
					}
					var that = this
					seckillGoods(params).then(res => {
						var itemProduct = res.msg.data
						that.product = that.product.concat(itemProduct)
						this.loadingType = this.page == this.last_page ? 2 : 0
					}).catch()
					uni.hideLoading();

				}
			},
		}
	}
</script>

<style lang="less" scoped>
	.seckill {
		background: #fff;
		height: 100%;
	}

	.product_banner {
		width: 100%;
		height: 242upx;
	}

	.seckill_time {
		width: 100%;
		height: 120upx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 29upx;

		text {
			color: #FF4E53;
			margin-right: 20upx;
		}

		.uni-countdown {
			transform: scale(1.1);
		}

		.next_seckill {
			color: #7246DD;
		}
	}

	.nonseckill {
		width: 100%;

		image {
			display: block;
			width: 191upx;
			height: 176upx;
			margin: auto;
			margin-top: 100upx;
		}

		.nonseckill_wz {
			margin-top: 40upx;
			text-align: center;
			font-size: 28upx;
			color: #999999;
		}
	}
</style>
